<template>
    <div>
        <a-modal
            title="查看人员的企业兼职情况"
            :visible="visible"
            @ok="handleOk"
            @cancel="visible = false"
            :footer="null"
            :width="1300"
            class="partTimeSituation-modal-v"
        >
            <div>
                <template slot="footer">
                    <div style="display: flex;justify-content: flex-end;">
                        <a-button @click="visible = false">取消</a-button>
                    </div>
                </template>
                <div>
                    <commpVxeTable
                        ref="headmanVxeTable"
                        v-if="VxeTableVisible"
                        :key="legalRepresentativeKey"
                        :config="legalRepresentativeConfig" 
                        :columns="legalRepresentativeColumnsVxe" 
                        :formItem="formItem"
                        :formData="formData"
                        :isCanWrap="true"
                        :adaptiveHeight="true"
                        @resetEvent="resetEvent"
                    >
                        <template v-slot:xm_default="{row}">
                            <span style="padding-right: 21;" v-if="row.xm&&row.xm.length == 2">
                                <span v-for="(trem,tI) in row.xm.split('')" :key="tI" >
                                    {{trem}}
                                    <span v-if="tI+1 !== row.xm.split('').length">&nbsp;&nbsp;</span>
                                </span>
                            </span>
                            <span style="padding-right: 21;" v-else>{{ row.xm }}</span>
                        </template>
                    </commpVxeTable>
                </div>
            </div>
        </a-modal>
    </div>
</template>
<script>
import assessCheckApi from './service/api'
import commpVxeTable from '@/components/commp-vxe-table/commp-vxe-table.vue'
import { xzxkApiqueryQyrylxList } from './service/index'
export default {
    components:{
        commpVxeTable,
    },
    props:{

    },
    data(){
        return{
            visible:false,
            currentData:{},
            VxeTableVisible:false,
            legalRepresentativeKey:null,
            legalRepresentativeConfig:{
                api:assessCheckApi.pushQyBcZgNotice,
                rowId: 'id',
                height:400,
                autoHidden:true,
                pageSize:1000000,
                paramet:{
                }
            },
            formData:{},
            formItem:[{
                label: '人员姓名',
                model: 'xm',
                defaultValue:'',
            },{
                label: '身份证号码',
                model: 'zjhm',
                defaultValue:'',
            },{
                label: '人员类型',
                model: 'flag',
                type:'Select',
                options:[]
            }],
            legalRepresentativeColumnsVxe:[{
                title:'企业名称',
                field: 'xdrmc',
            },{
                title: '姓名',
                field: 'xm',
                titleInterval:true,
                slots: {
                    header:'xm_header',
                    default: 'xm_default',
                },
                width:70
            },{
                title: '人员类型',
                field: 'ryfl',
            },{
                title: '职务',
                field: 'zw',
                titleInterval:true,
                slots: {
                    header:'zw_header',
                },
            },{
                title: '身份证号码',
                field: 'zjhm',
                width:176,
            },{
                title: '联系手机',
                field: 'sj',
                width:115,
            }],
        }
    },
    watch:{

    },
    mounted(){
        
    },
    methods:{
        async getData(row){
            let res = await xzxkApiqueryQyrylxList()
            var arr = []
            await res.result.forEach((item,index)=>{
                arr.push({
                    label:item.ZDWB,
                    value:item.ZDZ,
                })
            })
            this.currentData = row
            this.formData = {
                xm:row.xm,
                zjhm:row.zjhm,
            }
            this.legalRepresentativeConfig.paramet = {
                zjhm:row.zjhm,
                xm:row.xm,
            }
            
            this.formItem[2].options = arr
            this.VxeTableVisible = true
            this.legalRepresentativeKey = Date.now()
        },
        resetEvent(){
            this.formData = {}
            this.legalRepresentativeConfig.paramet = {}
            this.legalRepresentativeKey = Date.now()
        },
        handleOk(){

        },
    }
}
</script>
<style lang="less">
.partTimeSituation-modal-v{
    .ant-modal-body{
        padding: 8px;
    }
}
</style>